<template>
  <div class="app-container">
    <!-- 搜索 -->
    <department-search
      :init-params="initParams"
      :search-params="searchKey"
      @on-init="handleInitList"
    />
    <!-- 列表 -->
    <department-table
      :data="listData"
      :search-params="searchKey"
      :total-count="totalCount"
      :list-loading="listLoading"
      @on-init="handleInitList"
      @on-edit="handleEditShow"
    />
    <!-- 编辑弹出框 -->
    <department-edit
      :visible.sync="editInfo.visible"
      :detail-data="editInfo.detailInfo"
      @create="handleCreated"
      @update="handleUpdated"
    />
  </div>
</template>

<script>
import { getDepartmentListAPI, exportDepartmentListAPI } from '@/api/system/department'
import { DepartmentSearch, DepartmentTable, DepartmentEdit } from './components'
import request from '@/utils/request'
export default {
  name: 'DepartmentList',
  components: {
    DepartmentSearch,
    DepartmentTable,
    DepartmentEdit
  },
  mixins: [],
  props: {},
  data() {
    return {
      initParams: { // 初始化参数
        deptName: '', // 部门名称
        salaryStatus: '', // 状态
        salaryMonth: ''
      },
      searchKey: {}, // 搜索参数
      editInfo: { // 编辑弹出框
        visible: false, // 是否显示模态框
        detailInfo: {}
      },
      totalCount: 0, // 分页用的列表总条数
      listLoading: false,
      listData: [] // 列表数据
    }
  },
  computed: {},
  watch: {
    initParams: {
      handler: function(newVal, oldVal) {
        if (JSON.stringify(newVal) !== JSON.stringify(this.searchKey)) {
          this.searchKey = JSON.parse(JSON.stringify(newVal))
        }
      },
      immediate: true
    }
  },
  created() {
    const time = new Date()
    var month = time.getMonth()
    var year = time.getFullYear()
    if (month == 0) {
      month = '12'
      year = year - 1
    } else if (month < 10) {
      month = '0' + month
    }
    this.initParams.salaryMonth = year + '-' + month
    this.searchKey.salaryMonth = year + '-' + month
  },
  mounted() {
    this.initData()
  },
  methods: {
    handleEditShow(data = {}) { // 编辑－显示弹出框
      this.editInfo.visible = true
      this.editInfo.detailInfo = data
    },
    handleCreated() { // 添加成功
      this.searchKey.page = 1
      this.getListData()
    },
    handleUpdated() { // 编辑成功
      this.getListData()
    },
    handleDelete() { // 删除

    },
    handleInitList(params = {}) { // 初始化列表
      this.searchKey = {
        ...this.searchKey,
        ...params
      }
      this.getListData()
    },
    async getListData() { // 获取列表数据
      try {
        const { searchKey } = this
        this.listLoading = true
        const response = await request({
          url: '/hr/salary/supervise',
          method: 'get',
          params: {
            ...searchKey
          }
        })

        const result = response
        if (+result.code === 200) {
          this.listData = result.data || []
          console.log(this.listData)
          // this.totalCount = result.totalElements || 0
        } else {
          this.$notify.error({
            title: '错误',
            message: result.msg || '获取列表失败！'
          })
        }
      } catch (error) {
        // console.log(error)
        this.$notify.error({
          title: '错误',
          message: error.message || '获取列表失败!'
        })
      } finally {
        this.listLoading = false
      }
    },
    async initData() { // 初始化数据
      this.getListData()
    }
  }
}
</script>

<style lang="scss" scoped>
  .app-container {
    &-left {
      width: 255px;
      float: left;
    }

    &-right {
      margin-left: 260px;
    }
  }
</style>
